﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>CCSDK测试登录界面</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
    <script type="text/javascript" src="images/login.js"></script>
    <link href="css/login2.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<h1>CCSDK测试登录界面<sup>V2018</sup></h1>

<div class="login" style="margin-top:50px;">

    <div class="header">
        <div class="switch" id="switch">
            <a class="switch_btn_focus" id="switch_qlogin" href="javascript:void(0);" tabindex="7">直播</a>
            <a class="switch_btn" id="switch_login" href="javascript:void(0);" tabindex="8">回放</a>
            <a class="switch_btn" id="mobile" href="javascript:void(0);" tabindex="9">直播mobile</a>
            <a class="switch_btn" id="playback-mobile" href="javascript:void(0);" tabindex="10">回放mobile</a>
            <div class="switch_bottom" id="switch_bottom" style="position: absolute; width: 64px; left: 0px;"></div>
        </div>
    </div>

    <div class="qlogin" id="live-menu" style="display: block; ">

        <div class="web_login">
            <form name="form2" accept-charset="utf-8" action="" method="post">
                <input type="hidden" name="to" value="reg"/>
                <input type="hidden" name="did" value="0"/>
                <ul class="reg_form">
                    <li>

                        <label for="user" class="input-tips2">userid：</label>
                        <div class="inputOuter2">
                            <input id="live-userid" type="text" name="user"  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <label for="passwd" class="input-tips2">roomid：</label>
                        <div class="inputOuter2">
                            <input id="live-roomid" type="password" name="passwd"  class="inputstyle2"/>
                        </div>

                    </li>
                    <li>
                        <label for="passwd2" class="input-tips2">viewername：</label>
                        <div class="inputOuter2">
                            <input id="live-viewername" type="password" name=""  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <label for="qq" class="input-tips2">viewertoken：</label>
                        <div class="inputOuter2">

                            <input id="live-viewertoken" type="text" name="qq"  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <div class="inputArea">
                            <input type="button" style="margin-top:10px;margin-left:85px;" class="button_blue"
                                   value="登录"/>
                        </div>

                    </li>
                    <div class="cl"></div>
                </ul>
            </form>


        </div>


    </div>

    <div class="qlogin" id="playback-menu" style="display: none; ">

        <div class="web_login">
            <form name="form2" accept-charset="utf-8" action="" method="post">
                <input type="hidden" name="to" value="reg"/>
                <input type="hidden" name="did" value="0"/>
                <ul class="reg_form" id="">
                    <li>

                        <label for="user" class="input-tips2">userId：</label>
                        <div class="inputOuter2">
                            <input id="playback-userId" type="text" name="user"  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <label for="passwd" class="input-tips2">roomId：</label>
                        <div class="inputOuter2">
                            <input id="playback-roomId" type="password" name="passwd"  class="inputstyle2"/>
                        </div>

                    </li>
                    <li>
                        <label for="passwd2" class="input-tips2">recordId：</label>
                        <div class="inputOuter2">
                            <input id="playback-recordId" type="password" name=""  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <label for="qq" class="input-tips2">viewername：</label>
                        <div class="inputOuter2">

                            <input id="playback-viewername" type="text" name="qq"  class="inputstyle2"/>
                        </div>

                    </li>


                    <li>
                        <label for="qq" class="input-tips2">viewertoken：</label>
                        <div class="inputOuter2">

                            <input id="playback-viewertoken" type="text" name="qq"  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <div class="inputArea">
                            <input type="button" style="margin-top:10px;margin-left:85px;" class="button_blue"
                                   value="登录"/>
                        </div>

                    </li>

                    <div class="cl"></div>
                </ul>
            </form>


        </div>


    </div>

    <div class="qlogin" id="mobile-menu" style="display: none; ">

        <div class="web_login">
            <form name="form2" accept-charset="utf-8" action="" method="post">
                <input type="hidden" name="to" value="reg"/>
                <input type="hidden" name="did" value="0"/>
                <ul class="reg_form">
                    <li>

                        <label for="user" class="input-tips2">userid：</label>
                        <div class="inputOuter2">
                            <input id="mobile-userid" type="text" name="user"  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <label for="passwd" class="input-tips2">roomid：</label>
                        <div class="inputOuter2">
                            <input id="mobile-roomid" type="password" name="passwd"  class="inputstyle2"/>
                        </div>

                    </li>
                    <li>
                        <label for="passwd2" class="input-tips2">viewername：</label>
                        <div class="inputOuter2">
                            <input id="mobile-viewername" type="password" name=""  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <div class="inputArea">
                            <input type="button" style="margin-top:10px;margin-left:85px;" class="button_blue"
                                   value="登录"/>
                        </div>

                    </li>
                    <div class="cl"></div>
                </ul>
            </form>


        </div>


    </div>

    <div class="qlogin" id="playback-mobile-menu" style="display: none; ">

        <div class="web_login">
            <form name="form2" id="regUser" accept-charset="utf-8" action="" method="post">
                <input type="hidden" name="to" value="reg"/>
                <input type="hidden" name="did" value="0"/>
                <ul class="reg_form" id="reg-ul">
                    <li>

                        <label for="user" class="input-tips2">userId：</label>
                        <div class="inputOuter2">
                            <input id="playback-mobile-userId" type="text" id="user" name="user"  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <label for="passwd" class="input-tips2">roomId：</label>
                        <div class="inputOuter2">
                            <input id="playback-mobile-roomId" type="password" id="passwd" name="passwd"  class="inputstyle2"/>
                        </div>

                    </li>
                    <li>
                        <label for="passwd2" class="input-tips2">recordId：</label>
                        <div class="inputOuter2">
                            <input id="playback-mobile-recordId" type="password" id="passwd2" name=""  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <label for="qq" class="input-tips2">viewername：</label>
                        <div class="inputOuter2">

                            <input id="playback-mobile-viewername" type="text" name="qq"  class="inputstyle2"/>
                        </div>

                    </li>


                    <li>
                        <label for="qq" class="input-tips2">viewertoken：</label>
                        <div class="inputOuter2">

                            <input id="playback-mobile-viewertoken" type="text" id="qq" name="qq"  class="inputstyle2"/>
                        </div>

                    </li>

                    <li>
                        <div class="inputArea">
                            <input type="button" id="reg" style="margin-top:10px;margin-left:85px;" class="button_blue"
                                   value="登录"/>
                        </div>

                    </li>

                    <div class="cl"></div>
                </ul>
            </form>


        </div>


    </div>

</div>
<div class="jianyi">*推荐使用ie8或以上版本ie浏览器或Chrome内核浏览器访问本站</div>
<script>

    clear();

    $('.inputArea').each(function (index) {
        $(this).val(index);
        $(this).click(function () {
            clear();
            switch ($(this).val()) {
                case '0':
                    var obj = {};
                    obj.userid = $('#live-userid').val();
                    obj.roomid = $('#live-roomid').val();
                    obj.viewername = $('#live-viewername').val();
                    obj.viewertoken = $('#live-viewertoken').val();
                    setValue(obj);
                    location.href = '../index.html';
                    break;
                case '1':
                    var obj = {};
                    obj.userId = $('#playback-userId').val();
                    obj.roomId = $('#playback-roomId').val();
                    obj.recordId = $('#playback-recordId').val();
                    obj.viewername = $('#playback-viewername').val();
                    obj.viewertoken = $('#playback-viewertoken').val();
                    setValue(obj);
                    location.href = '../playback.html';
                    break;
                case '2':
                    var obj = {};
                    obj.userid = $('#mobile-userid').val();
                    obj.roomid = $('#mobile-roomid').val();
                    obj.viewername = $('#mobile-viewername').val();
                    setValue(obj);
                    location.href = '../mobile.html';
                    break;
                case '3':
                    var obj = {};
                    obj.userId = $('#playback-mobile-userId').val();
                    obj.roomId = $('#playback-mobile-roomId').val();
                    obj.recordId = $('#playback-mobile-recordId').val();
                    obj.viewername = $('#playback-mobile-viewername').val();
                    obj.viewertoken = $('#playback-mobile-viewertoken').val();
                    setValue(obj);
                    location.href = '../playback-mobile.html';
                    break;
            }
        });
    });

    function setValue(obj) {
        localStorage.userid = obj.userid;
        localStorage.roomid = obj.roomid;
        localStorage.viewername = obj.viewername;
        localStorage.viewertoken = obj.viewertoken;
        localStorage.viewercustomua = obj.viewercustomua;
        localStorage.language = obj.language;
        localStorage.userId = obj.userId;
        localStorage.roomId = obj.roomId;
        localStorage.recordId = obj.recordId;
        localStorage.viewername = obj.viewername;
        localStorage.viewertoken = obj.viewertoken;
    }

    function clear(){
        localStorage.userid = '';
        localStorage.roomid = '';
        localStorage.viewername = '';
        localStorage.viewertoken = '';
        localStorage.viewercustomua = '';
        localStorage.language = '';
        localStorage.userId = '';
        localStorage.roomId = '';
        localStorage.recordId = '';
        localStorage.viewername = '';
        localStorage.viewertoken = '';
    }

</script>
</body>
</html>